<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: 贾振鹏
  Date: 2021/6/7
  Time: 16:06
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="renderer" content="webkit">
    <title></title>
    <link rel="stylesheet" href="${css}/pintuer.css">
    <link rel="stylesheet" href="${css}/admin.css">
    <script src="${js}/jquery.js"></script>
    <script src="${js}/pintuer.js"></script>
</head>
<body>

<div class="panel admin-panel margin-top" id="add">
    <div class="panel-head"><strong><span class="icon-pencil-square-o"></span> 增加内容</strong></div>
    <div class="body-content">
        <c:if test="${not empty msg}">
            <span style="color: red;">${msg}</span>
        </c:if>
        <form method="post" class="form-x" action="${root}/admin/loop/add">
            <div class="form-group">
                <div class="label">
                    <label>标题：</label>
                </div>
                <div class="field">
                    <input type="text" class="input w50" value="" name="title" data-validate="required:请输入标题" />
                    <div class="tips"></div>
                </div>
            </div>
            <div class="form-group">
                <div class="label">
                    <label>URL：</label>
                </div>
                <div class="field">
                    <select name="url" class="input w50">
                        <c:forEach items="${newsList}" var="news">
                            <option value="/news/newsinfo?id=${news.id}">${news.title}</option>
                        </c:forEach>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <div class="label">
                    <label>图片：</label>
                </div>
                <div class="field">
                    <input type="file" id="url1" name="img" class="input tips" style="width:25%; float:left;"  value="" data-toggle="hover" data-place="right" data-image="" />
                    <input type="button" class="button bg-blue margin-left" id="image1" value="+ 浏览上传"  style="float:left;">
                    <div class="tipss">图片尺寸：1920*500</div>
                </div>
            </div>

            <input type="hidden" name="src" id="imgSrc">

            <div class="form-group">
                <div class="label">
                    <label>轮播状态：</label>
                </div>
                <div class="field">
                    <select name="loop" class="input w50">
                            <option value="0">不轮播</option>
                            <option value="1">加入轮播</option>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <div class="label">
                    <label></label>
                </div>
                <div class="field">
                    <button class="button bg-main icon-check-square-o" type="submit"> 提交</button>
                </div>
            </div>
        </form>
    </div>
</div>

<script>
    $(function () {
        $("#url1").change(function () {
            var formdata = new FormData();
            formdata.append("newsImage", document.getElementById("url1").files[0]);
            var url = "${root}/admin/news/upload";
            $.ajax({
                url: url,
                type: "post",
                data: formdata,
                contentType: false,
                processData: false,
                success: function (data) {
                    $("#imgSrc").val(data.imageSrc)
                    $("#url1").attr("data-image",data.imageSrc);
                }
            })
        });

    });
</script>

</body>
</html>
